<template>
	<view class="page">
    <u-navbar :fixed="false" title="物料查询" :autoBack="true" bgColor="#fff"></u-navbar>
    <view class="search" v-if="!type">
      <view class="search-type" @click="pickerType = 'type'">{{ form.typeName }}
        <u-icon name="arrow-down" size="24rpx"></u-icon>
      </view>
      <u-search
        placeholder="请输入"
        v-model="searchValue"
        @search="search"
        :showAction="false"
      ></u-search>
    </view>
    <view class="goods-title">
      1.xxxxxxxx测试测试商品名称 测试测试商品名称 测试测试商品名称
    </view>
    <view class="goods-info u-m-b-36">
      <view class="u-flex u-m-b-16">
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位</view>
          <view class="form-content">1233333</view>
        </view>
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位数量</view>
          <view class="form-content">1233333</view>
        </view>
      </view>
      <view class="u-flex u-m-b-16">
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位</view>
          <view class="form-content">1233333</view>
        </view>
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位数量</view>
          <view class="form-content">1233333</view>
        </view>
      </view>
      <view class="u-flex u-m-b-16">
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位</view>
          <view class="form-content">1233333</view>
        </view>
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位数量</view>
          <view class="form-content">1233333</view>
        </view>
      </view>
      <view class="u-flex">
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位</view>
          <view class="form-content">1233333</view>
        </view>
        <view class="u-flex-1 form-info">
          <view class="form-lable">货位数量</view>
          <view class="form-content">1233333</view>
        </view>
      </view>
      <u-line></u-line>
    </view>
    <u-picker :show="pickerType!=''" :columns="[pickerInfo[pickerType]]" keyName="name" @confirm="pickerConfirm" @cancel="pickerType = ''"></u-picker>
	</view>
</template>

<script>

export default {
  data() {
		return {
      isFullSucreen: this.isFullSucreen,
      searchValue: '000024',
      pickerType: '',
      pickerInfo: {
         type: [
          {
            id: 'Materidal',
            name: '物料编码'
          },
          {
            id: 'MaterialName',
            name: '物料名称',
          },
          {
            id: 'ModelName',
            name: '规格型号'
          },
        ],
      },
      form: {
        typeName: '物料编码',
        type: 'Materidal',
      },
      orgId: '',
    }
  },
  async onLoad(options) {
  },
  methods: {
    pickerConfirm(e) {
      if(e.value[0].id) {
        this.form[this.pickerType] = e.value[0].id
        this.form[this.pickerType+'Name'] = e.value[0].name
      } else {
        this.form[this.pickerType] = ''
        this.form[this.pickerType+'Name'] = ''
      }
      this.pickerType = ''
    },
  }
}
</script>

<style lang="less" scoped>
.page {
  width: 100%;
  min-height: 100vh;
  background: #f2f2f2;
  padding:0 0 188rpx;
  .goods-title {
    padding: 20rpx 30rpx;
    background: #f0f0f0;
    font-size: 32rpx;
    font-weight: bold;
  }
  .goods-info {
    padding: 20rpx 30rpx;
    background: #fff;
  }
  .footer-actions {
    border-top: 2rpx solid #d6d7d9;
    background: linear-gradient(90deg, #2979ff 0%, #7D9EF8 100%);
    position: fixed;
    bottom: 0;
    width: 100%;
    .footer-btn {
      display: flex;
      justify-content: center;
      align-items: center;
      color: #FFF;
      height: 90rpx;
    }
  }
}
</style>
